<template>
	<CardWrapper @onCard="onCard(ControlButton[data.currState].navDetailPath)">
		<template #head>
			<view class="head u-flex u-row-between">
				<text class="head-left  ">
					{{ data.createTime|typeText}}
				</text>
				<text class="head-right  " :style="StateColorStyle">
					{{data.currStateToName}}
				</text>
			</view>
		</template>
		<template #title>
			<template v-if="ShowToBeTakenInfo">
				<text>{{data.receiveDeptPlace || '-'}}</text>
			</template>
			<template v-else-if="ShowDistributionInfo">
				<text>{{data.receiveDeptPlace || '-'}}</text>
			</template>
			<template v-else>
				<text>{{data.deviceName || '-'}} </text>
			</template>

		</template>
		<template #bodyLeft>
			<view v-show="ShowOneSelf">
				<view class="info">
					<text class="info-label">自取科室</text>
					<text class="info-value">{{data.deptIdToName}}</text>
				</view>
			</view>
			<view v-show="ShowOfferReview">
				<view class="info">
					<text class="info-label">所属科室</text>
					<text class="info-value">{{data.deptIdToName}}{{data.hospitalIdToName||''}}</text>
				</view>
				<view class="info">
					<text class="info-label">报价厂家</text>
					<text class="info-value">{{data.manufacturerIdToName||'-'}} </text>
				</view>
				<view class="info">
					<text class="info-label">报价金额</text>
					<text class="info-value">{{data.quoteMoney||'0'}}元</text>
				</view>
			</view>
			<view v-show="ShowToBeTakenInfo || ShowDistributionInfo">
				<view class="info">
					<text class="info-label">配送设备</text>
					<text class="info-value">{{data.deviceName}}</text>
				</view>
				<view class="info">
					<text class="info-label">配送至</text>
					<text class="info-value">{{data.receiveDeptToName||'-'}} </text>
				</view>

			</view>
		</template>
		<template #footer>
			<view class="footer">
				<HButton :block="false" class="" type="info" icon="phone" plain size="small" @click="onPhone">电话联系</HButton>
				<HButton :block="false" size="small" class="u-m-l-30" plain @click="onQuoteButton(ControlButton[data.currState].navHandlePath)">
					{{ControlButton[data.currState].text}}
				</HButton>
			</view>
		</template>
	</CardWrapper>
</template>

<script>
	import CardWrapper from '../../components/cardWrapper.vue'
	import HButton from '../../../button/index.vue'
	import Colors from '@/common/color.js'
	import { State } from '@/sendRepair/department/state.js'
	export default {
		components: {
			CardWrapper,
			HButton,
		},

		filters: {
			typeText(val) {
				return `派单时间 : ${val||'-'}`
			}
		},
		props: {
			data: {
				type: Object,
				default: () => {}
			},
			type: {
				type: String,
				default: ''
			}
		},

		computed: {

			ControlButton() {
				return State.buttonParams
			},
			ShowQuote() {
				// 待报价状态
				return this.data.currState == 1
			},
			ShowToBeTakenInfo() {
				return ['toBeTaken'].includes(this.type)
			},
			ShowDistributionInfo() {
				return this.type === 'distribution'
			},
			ShowOfferReview() {
				return this.type === 'review'
			},
			ShowReturnInfo() {
				return this.type === 'return'
			},
			//显示科室自取
			ShowOneSelf() {
				return this.type === 'oneself'
			},
			HiddenQuoteButton() {
				return this.data.currState == 3 ? false : true
			},
			StateColorStyle() {
				return `color:${State.colors[this.data.currState]}`;
			}



		},
		data() {
			return {


			}
		},

		methods: {

			onCard(path) {
				const { currState, id, currStateToName } = this.data
				let queryParams = `?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				let url = `${path}${queryParams}`
				wx.navigateTo({
					url: url
				})
			},


			onQuoteButton(path) {
				const { currState, id, currStateToName } = this.data
				let queryParams = `?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				let url = `${path}${queryParams}`
				wx.navigateTo({
					url: url
				})
				// switch (code) {
				// 	// 取走
				// 	case 'toBeTaken':
				// 		pagePath = `pages/sendRepair/department/pages/stayTakeAwayDetail?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				// 		break;
				// 		//送达 
				// 	case 'service':
				// 		pagePath = `pages/sendRepair/department/pages/deliveryDetail?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				// 		break;

				// 	case '':
				// 		pagePath = `pages/sendRepair/factory/pages/pickUpDetail?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				// 		break;
				// 		//报价审核
				// 	case 'review':
				// 		pagePath = `pages/sendRepair/department/pages/offerReviewDetail?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				// 		break;
				// 		//送达
				// 	case 'service':
				// 		pagePath = `pages/sendRepair/factory/pages/returnDetail?state=${currState}&id=${id}&currStateToName=${currStateToName}`
				// 		break;
				// 		//重新报价
				// 	case 'aginQuote':
				// 		pagePath = `pages/sendRepair/factory/pages/quote?state=${4}&id=${id}&currStateToName=${'报价未通过'}`
				// 		break;


				// }

				// wx.navigateTo({
				// 	url: `/${pagePath}`
				// }) 
			},

			//电话联系
			onPhone(data = null) {
				this.$emit('onPhone', data)
			},

		}

	}
</script>


<style lang="scss" scoped>
	.head {
		&-left {
			font-weight: 400;
			font-size: 28rpx;
			color: #98A5B3;
		}

		&-right {
			font-weight: 600;
			font-size: 28rpx;
			text-align: right;
			padding-right: 20rpx;
		}
	}

	.info {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;

		&-label {
			flex-basis: 20%;
			font-weight: 400;
			font-size: 28rpx;
			color: #98A5B3;
		}

		&-value {
			flex: 1;
			font-weight: 400;
			font-size: 28rpx;
			color: #0F2E4D;
		}

		&+& {
			margin-top: 30rpx;
		}
	}

	.footer {
		text-align: right;
		margin-top: 60rpx;
		padding-right: 20rpx;

		>.leftButton {
			margin-right: 30rpx;
			display: inline-block
		}
	}
</style>
